﻿<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>塘驿科技</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="上海塘驿信息科技有限公司" />
    <meta name="keywords" content="html5,  微信开发, 开发, bootstrap, 工作流, BPM, OA, 办公自动化" />
    <meta name="author" content="Betaty.CO" />

    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <link rel="shortcut icon" href="favicons.ico">
    <!-- Google Webfont -->
    <link href='http://fonts.useso.com/css?family=Lato:400,300,700|Unica+One' rel='stylesheet' type='text/css'>
    <!-- Themify Icons -->
    <link rel="stylesheet" href="css/themify-icons.css">
    <!-- Icomoon Icons -->
    <link rel="stylesheet" href="css/icomoon-icons.css">
    <!-- Bootstrap -->
    <link rel="stylesheet" href="css/bootstrap.css">
    <!-- Owl Carousel -->
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/owl.theme.default.min.css">
    <!-- Magnific Popup -->
    <link rel="stylesheet" href="css/magnific-popup.css">
    <!-- Easy Responsive Tabs -->
    <link rel="stylesheet" href="css/easy-responsive-tabs.css">
    <!-- Theme Style -->
    <link rel="stylesheet" href="css/style.css">
    <!-- FOR IE9 below -->
    <!--[if lt IE 9]>
    <script src="js/modernizr-2.6.2.min.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->

</head>
<body>

    <!-- Header -->
    <header id="fh5co-header" role="banner">

        <!-- Logo -->
        <div id="fh5co-logo" class="text-center">
            <a href="index.html">
                <img src="images/logo.png" alt="Image">
            </a>

        </div>
        <!-- Logo -->
        <!-- Mobile Toggle Menu Button -->
        <a href="#" class="js-fh5co-nav-toggle fh5co-nav-toggle"><i></i></a>

        <!-- Main Nav -->
        <div id="fh5co-main-nav">
            <nav id="fh5co-nav" role="navigation">
                <ul>
                    <li class="active">
                        <a href="javascript:void(0);">简 介</a>
                    </li>
                    <li>
                        <a href="javascript:void(0);">展 示</a>
                    </li>
                    <li>
                        <a href="javascript:void(0);">找 我</a>
                    </li>
                </ul>
            </nav>
        </div>
        <!-- Main Nav -->
    </header>
    <!-- Header -->
    <!-- Main -->
    <main role="main">

        <!-- Slider -->
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-md-push-4 col-sm-8 col-sm-push-4">
                    <h1 class="fh5co-intro"><span class="fh5co-border"></span>Light is a free responsive HTML5 template using bootstrap released under </h1>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="owl-carousel owl-carousel-fullwidth">
                        <div class="item"><img src="images/slide_1.jpg" alt="image"></div>
                        <div class="item"><img src="images/slide_2.jpg" alt="image"></div>
                        <div class="item"><img src="images/slide_3.jpg" alt="image"></div>
                        <div class="item"><img src="images/slide_4.jpg" alt="image"></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Slider -->
        <div class="copyrights">Collect from <a href="http://www.cssmoban.com/">手机网站模板</a></div>

        <div class="fh5co-spacer fh5co-spacer-lg"></div>

        <!-- Features -->
        <div class="fh5co-features">
            <div class="container">
                <div class="fh5co-section-title text-center">
                    <h2 class="fh5co-title">Features</h2>
                </div>
                <div class="fh5co-spacer fh5co-spacer-sm"></div>
                <div class="row">

                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-command"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Simplicity</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>
                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-eye2"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Retina Ready</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>

                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-monitor"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Fully Responsive</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>

                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-cog2"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Intuitive</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>

                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-paragraph"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Typography</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>
                    <div class="col-md-4 col-sm-6 fh5co-feature text-center">
                        <span class="fh5co-feature-icon">
                            <i class="icon-box2"></i>
                        </span>
                        <h3 class="fh5co-feature-title">Out of the Box</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores saepe, sunt eos necessitatibus consectetur.</p>
                    </div>

                </div>
            </div>
        </div>
        <!-- Features -->

        <div class="fh5co-spacer fh5co-spacer-lg"></div>

        <!-- Section Half -->
        <div class="fh5co-half">
            <div class="fh5co-half-img fh5co-50" style="background-image: url(images/slide_2.jpg)"></div>
            <div class="fh5co-half-text fh5co-50 fh5co-right">
                <div class="fh5co-text">

                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-9 col-md-push-1 col-sm-9 col-sm-push-1">
                                <div class="fh5co-section-title text-left">
                                    <h2 class="fh5co-title">Clean &amp; Minimal Design</h2>
                                </div>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa doloribus molestias, explicabo itaque, quos consequatur quam, tempore enim voluptatum nulla quas iusto voluptate quae modi commodi maiores voluptatibus perspiciatis aut.</p>
                                <div class="fh5co-spacer fh5co-spacer-xxs"></div>
                                <p><a href="#" class="btn btn-primary btn-md fh5co-btn-other-option">Get Started</a> <span class="fh5co-other-option"><span class="fh5co-or text-muted">or</span> <a href="#" class="btn-link">Learn More</a></span></p>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <!-- Section Half -->

        <div class="fh5co-spacer fh5co-spacer-lg"></div>

        <!-- Testimonial -->
        <div class="container">
            <div class="fh5co-section-title text-center">
                <h2 class="fh5co-title">Our Clients Say</h2>
            </div>
            <br class="fh5co-spacer fh5co-spacer-sm">
            <div class="owl-carousel-fullwidth">
                <div class="item">
                    <p class="text-center quote">&ldquo;Design must be functional and functionality must be translated into visual aesthetics, without any reliance on gimmicks that have to be explained. &rdquo; <cite class="author">&mdash; Ferdinand A. Porsche</cite></p>
                </div>
                <div class="item">
                    <p class="text-center quote">&ldquo;Creativity is just connecting things. When you ask creative people how they did something, they feel a little guilty because they didn’t really do it, they just saw something. It seemed obvious to them after a while. &rdquo;<cite class="author">&mdash; Steve Jobs</cite></p>
                </div>
                <div class="item">
                    <p class="text-center quote">&ldquo;I think design would be better if designers were much more skeptical about its applications. If you believe in the potency of your craft, where you choose to dole it out is not something to take lightly. &rdquo;<cite class="author">&mdash; Frank Chimero</cite></p>
                </div>
            </div>
        </div>
        <!-- Testimonial -->

        <div class="fh5co-spacer fh5co-spacer-lg"></div>

        <!-- Press -->
        <div class="fh5co-press">
            <div class="container">

                <div class="fh5co-section-title text-center">
                    <h2 class="fh5co-title">Press</h2>
                </div>
                <div class="fh5co-spacer fh5co-spacer-sm"></div>
                <div class="row">

                    <div class="col-md-6">
                        <!-- Press Item -->
                        <div class="fh5co-press-item">
                            <div class="fh5co-press-img" style="background-image: url(images/slide_2.jpg)">
                            </div>
                            <div class="fh5co-press-text">
                                <h3 class="h2 fh5co-press-title">Simplicity <span class="fh5co-border"></span></h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis eius quos similique suscipit dolorem cumque vitae qui molestias illo accusantium...</p>
                            </div>
                        </div>
                        <!-- Press Item -->
                    </div>

                    <div class="col-md-6">
                        <!-- Press Item -->
                        <div class="fh5co-press-item">
                            <div class="fh5co-press-img" style="background-image: url(images/slide_1.jpg)">
                            </div>
                            <div class="fh5co-press-text">
                                <h3 class="h2 fh5co-press-title">Versatile <span class="fh5co-border"></span></h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis eius quos similique suscipit dolorem cumque vitae qui molestias illo accusantium...</p>
                            </div>
                        </div>
                        <!-- Press Item -->
                    </div>

                    <div class="col-md-6">
                        <!-- Press Item -->
                        <div class="fh5co-press-item">
                            <div class="fh5co-press-img" style="background-image: url(images/slide_3.jpg);">
                            </div>
                            <div class="fh5co-press-text">
                                <h3 class="h2 fh5co-press-title">Aesthetic <span class="fh5co-border"></span></h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis eius quos similique suscipit dolorem cumque vitae qui molestias illo accusantium...</p>
                            </div>
                        </div>
                        <!-- Press Item -->
                    </div>

                    <div class="col-md-6">
                        <!-- Press Item -->
                        <div class="fh5co-press-item">
                            <div class="fh5co-press-img" style="background-image: url(images/slide_4.jpg);">
                            </div>
                            <div class="fh5co-press-text">
                                <h3 class="h2 fh5co-press-title">Creative <span class="fh5co-border"></span></h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis eius quos similique suscipit dolorem cumque vitae qui molestias illo accusantium...</p>
                            </div>
                        </div>
                        <!-- Press Item -->
                    </div>

                </div>
                <div class="fh5co-spacer fh5co-spacer-xs"></div>
                <div class="row">
                    <div class="col-md-6 col-md-offset-3">
                        <a href="#" class="btn btn-outline btn-md btn-block">View All Press Releases</a>
                    </div>
                </div>



            </div>
        </div>
        <!-- Press -->


    </main>
    <!-- Main -->
    <!-- Footer -->
    <footer id="fh5co-footer" role="contentinfo">
        <div class="container">
            <div class="row">
                <div class="col-md-3 col-xs-12 fh5co-footer-widget ">
                    <img src="images/logo.png" alt="Image" class="img-responsive">
                </div>
                <div class="col-md-2 col-xs-6 fh5co-footer-widget">
                    <ul>
                        <li><a href="#">Our Team</a></li>
                        <li><a href="#">Contact Us</a></li>
                        <li><a href="#">Support</a></li>
                        <li><a href="#">Blog</a></li>
                    </ul>
                </div>
                <div class="col-md-2 col-xs-6 fh5co-footer-widget">
                    <ul>
                        <li><a href="#">Our Clients</a></li>
                        <li><a href="#">Our Culture</a></li>
                        <li><a href="#">Capabilities</a></li>
                        <li><a href="#">Features</a></li>
                    </ul>
                </div>

                <div class="col-md-5 col-xs-12 fh5co-footer-widget">
                    <div class="fh5co-section-title">
                        <h5 class="fh5co-title">Subscribe</h5>
                    </div>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iure sint, inventore excepturi aliquid ipsam officiis!</p>
                    <form class="form-inline" id="fh5co-form-subscribe">
                        <div class="form-group pull-left">
                            <input type="email" class="form-control input-lg input-block" id="subscribe-email" placeholder="info@freehtml5.co">
                        </div>
                        <button type="submit" class="btn btn-primary btn-subscribe-send">Send</button>

                    </form>
                </div>
            </div>
            <div class="fh5co-spacer fh5co-spacer-md"></div>
            <div class="row">
                <div class="col-md-6">
                    <p class="fh5co-copyright">&copy; Light 2015. All Rights Reserved. <br>Designed by More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a> and Images by <a href="#" target="_blank">DeathtoStock</a></p>
                </div>
                <div class="col-md-6">
                    <ul class="fh5co-social">
                        <li><a href="#"><i class="icon-facebook"></i></a></li>
                        <li><a href="#"><i class="icon-twitter"></i></a></li>
                        <li><a href="#"><i class="icon-instagram"></i></a></li>
                        <li><a href="#"><i class="icon-dribbble"></i></a></li>
                        <li><a href="#"><i class="icon-pinterest"></i></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>
    <!-- Footer -->
    <!-- Go To Top -->
    <a href="#" class="fh5co-gotop"><i class="ti-shift-left"></i></a>


    <!-- jQuery -->
    <script src="js/jquery-1.10.2.min.js"></script>
    <!-- jQuery Easing -->
    <script src="js/jquery.easing.1.3.js"></script>
    <!-- Bootstrap -->
    <script src="js/bootstrap.js"></script>
    <!-- Owl carousel -->
    <script src="js/owl.carousel.min.js"></script>
    <!-- Magnific Popup -->
    <script src="js/jquery.magnific-popup.min.js"></script>
    <!-- Easy Responsive Tabs -->
    <script src="js/easyResponsiveTabs.js"></script>
    <!-- FastClick for Mobile/Tablets -->
    <script src="js/fastclick.js"></script>
    <!-- Velocity -->
    <script src="js/velocity.min.js"></script>
    <!-- Main JS -->
    <script src="js/main.js"></script>

</body>
</html>
